.scheduler {
  display: flex;
  .btnCancelEdit,
  .btnEdit {
    margin-right: auto;
  }
  .cronValue {
    font-weight: bold;
  }

  .radios {
    display: flex;
    flex-wrap: wrap;
    width: 90vw;
    gap: rem(16);
    @include breakpoint('lg') {
      width: 100%;
    }
  }
  .schedulerItem {
    gap: rem(24);
    flex-direction: column;
    margin-right: auto;
    border: rem(1) solid var(--quaternary-color);
    box-shadow: $box-shadow-sm;
    border-radius: $border-radius-sm;
    padding: rem(8);
    // @include breakpoint('lg') {
    //   flex-direction: row;
    //   align-items: center;
    // }

    .fromContainer,
    .toContainer {
      flex-direction: column;
      gap: rem(4);
      @include breakpoint('lg') {
        flex-direction: row;
        margin-top: 0;
      }
    }

    .hiddenEndTimePicker {
      visibility: hidden;
    }
    .weekdaysContainer {
      flex-direction: column;
      gap: rem(4);

      @include breakpoint('md') {
        flex-direction: row;
        align-items: center;
        justify-content: center;
      }
    }

    .label {
      width: rem(100);
      font-weight: bold;
      &.customLabel {
        width: 100%;
      }
      &.weekDaysLabel {
        width: rem(150);
      }
    }
    .numberInput {
      width: rem(60);
    }

    .btnDrodown {
      width: rem(150);
      padding: rem(4);
      text-align: left;
    }
    .menuList {
      min-width: rem(80);
      width: rem(80);
      max-height: rem(350);
      overflow: auto;
      //   button {
      //     width: rem(80) !important;
      //   }
    }

    .timepicker {
      div[class*='react-time-picker__wrapper'] {
        display: flex;
        width: rem(180);

        div[class*='react-time-picker__inputGroup'] {
          display: flex;
          justify-content: space-evenly;
          background-color: var(--white-color);
          padding: rem(4) rem(8);
          border-radius: $border-radius-xs;

          font-size: rem(16);
          input,
          span {
            font-weight: bold;
          }

          [class*='__inputGroup__divider'] {
            @include flex-center;
            width: rem(16);
            font-size: rem(16);
            font-weight: bold;
          }
        }
        button[class*='__clear-button'] {
          margin-left: rem(16);
        }
      }
    }
    .customContainer {
      width: 100%;
    }
  }
}
